<%@ page language="java" contentType="text/html; charset=UTF-8"%>

<!DOCTYPE html>
<html>
<head>
<title>合同列表</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="renderer" content="webkit">
<%@ include file="/WEB-INF/common.jsp"%>

<link href="${path }/resources/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
<link href="${path }/resources/css/animate.css" rel="stylesheet">
<link href="${path }/resources/css/style.css?v=4.1.0" rel="stylesheet">

<!--dataTables css样式-->
<link rel="stylesheet" type="text/css"
	href="${path }/resources/css/jquery.dataTables.min.css">
<!--DataTables button扩展-->
<link rel="stylesheet" type="text/css"
	href="${path }/resources/css/buttons.dataTables.min.css">
	<!--模态框  -->
<link href="${path }/resources/css/bootstrap.min.css">

</head>
<body class="gray-bg" style="">
<jsp:include page="/WEB-INF/loginCheck.jsp" />
	<!--添加的表单  -->
	<div id="" barclass="panel-body" style="margin-top: 30px">
				<form id="defaultForm" action="" method="post"
			data-parsley-validate class="form-horizontal form-label-left"> 
			<div class="form-group">
				<label class="control-label col-md-3 col-sm-3 col-xs-12"
					for="last-name">项目名称：<span class="required">*</span>
				</label>
				<div class="col-md-6 col-sm-6 col-xs-12">
					<input value="${projectName}" name="projectName" 
						class="form-control col-md-7 col-xs-12" disabled="true">
				</div>
			</div>
			<div class="form-group">
				<label class="control-label col-md-3 col-sm-3 col-xs-12"
					for="first-name">计划名称：<span class="required">*</span>
				</label>
				<div class="col-md-6 col-sm-6 col-xs-12">
					<input type="text" value="${planName}" name="planName"
						class="form-control col-md-7 col-xs-12" disabled="true">
				</div>
			</div>
						<div class="form-group">
				<label class="control-label col-md-3 col-sm-3 col-xs-12"
					for="last-name">计划性质：<span class="required">*</span>
				</label>
				<div class="col-md-6 col-sm-6 col-xs-12">
					<input value="${type}" name="type" 
						class="form-control col-md-7 col-xs-12" disabled="true">
				</div>
			</div>
		</form>
	</div>
 	<div class="btn-group" style="margin-top: 5px;margin-left: 15px">
		<!-- 按钮触发模态框 -->
		<button class="btn btn-primary" data-toggle="modal" data-target="#myModal">
			下发计划
		</button>
	</div>
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
						&times;
					</button>
					<h4 class="modal-title" id="myModalLabel">
						下发计划
					</h4>
				</div>
				<div class="modal-body">
				<label class="control-label col-md-3 col-sm-3 col-xs-12"
					for="last-name">执行人员：<span class="required"></span>
				</label>
				<div class="col-md-9 col-sm-6 col-xs-12">
					<select id="enterprise_id" class="selectpicker form-control" data-live-search="true" name="enterprise_id">
					    <c:forEach items="${nameList}" var="nameList" >
							<option value="${nameList.id}"><c:out value="${nameList.name}"/></option>
						</c:forEach>
					</select>
				</div>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭
					</button>
					<button type="button" class="btn btn-primary" onclick="pushPlan()">
						提交
					</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
	<div class="btn-group" style="margin-left: 30px">
	<select class="form-control" name="buildingList" id="buildingList">
			<option value="-1">选择建筑物</option>
			<c:forEach items="${buildingList}" var="buildingList">
				<option value="${buildingList.id}"><c:out value="${buildingList.building_name}"/></option>
			</c:forEach>

		</select>
    </div>
  	<div class="btn-group">
		<button  class="btn btn-primary "  onclick="search()">查询</button>
	</div>
	<div class="btn-group">
		<a href="${path }/MaintenancePlan/planOfContract.htm?id=${contractId}"+ class="btn btn-primary" style="margin-left:700px;">返回</a>
	</div>
	<!--表格  -->
 	<div class="col-md-12 col-sm-12 col-xs-12" style="margin-top: 30px">
		<table id="planList"  style="width:100%">
		
			<thead>
				<tr>
					<th>计划所属类型</th>
					<th>系统名称</th>
					<th>维保项目</th>
					<th>维保内容</th>
					<th>位置</th>
					<th>计划下发状态</th>
					<th>工程师</th>
					<th>计划完成状态</th>
					<th>选择日期</th>
				</tr>
			</thead>
			
		</table>
	</div>
	
	<script src="${path }/resources/js/jquery.min.js"></script>
	<!-- Peity-->
	<script src="${path }/resources/js/plugins/peity/jquery.peity.min.js"></script>
	
	<!-- Bootstrap table-->
	<script src="${path }/resources/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
	<script src="${path }/resources/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>

	<!-- 自定义js-->
	<script src="${path }/resources/js/content.js?v=1.0.0"></script>
	
	<!-- jQuery Validation plugin javascript-->
    <script src="${path }/resources/js/plugins/validate/jquery.validate.min.js"></script>
    <script src="${path }/resources/js/plugins/validate/messages_zh.min.js"></script>
   
   	<!-- jQuery form  -->
    <script src="${path }/resources/js/jquery.form.min.js"></script>
    
    <!-- layer javascript -->
    <script src="${path }/resources/js/plugins/layer/layer.min.js"></script>
    
    	<!--DataTables 核心 js-->
	<script src="${path }/resources/js/jquery.dataTables.min.js"></script>
	<!--DataTables button扩展-->
	<script
		src="${path }/resources/js/dataTables.buttons.min.js"></script>
	<!-- datatables日期格式化 -->
	<script src="${path }/resources/js/moment.min.js"></script>
	
	<script>
	//点击查询按钮事件
	function search(){
		var buildingId = $("#buildingList").val();
		var planId = ${planId};
		
		$.ajax({
	  		 url: "/firefighting/MaintenancePlan/searchMaintenancePlanList.htm",
	           type: "POST",
	           dataType: "json",
	           data: {
	          	 "buildingId":buildingId,
	          	 "planId":planId,
	           },
	           success: function (data)
	           {
	        	  
	        	   /* var removeTR =$("tr[name='typeNameTR']");
		   	    	 for(index in removeTR){
		   		    	if(removeTR[index].name === "typeNameTR"){
		   		    	 removeTR[index].remove();
		   		    	}
		   		    	
		   		    } */
	          	 showTables(data);
	           },
	           error:function(data)
	           {
	         	  
	           }
	       });
	}
	</script>
	
	<script type="text/javascript">
	function showTables(data){
		 //console.log(data);
	      //然后 DataTables 这样初始化：
	      $('#planList').DataTable( {
	     	 data: data,
	     	bDestroy:true,
	      	 language: { 
	      		"paginate": {
	      	          "processing": "正在处理中。。。"
	      	        },
	      	      //"sProcessing": "处理中...",  
	      	      "sLengthMenu": "显示 _MENU_ 项结果",  
	      	      "sZeroRecords": "没有匹配结果",  
	      	      "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",  
	      	      "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",  
	      	      "sInfoFiltered": "(由 _MAX_ 项结果过滤)",  
	      	      "sInfoPostFix": "",  
	      	      "sSearch": "搜索:",  
	      	      "sUrl": "",  
	      	      "sEmptyTable": "表中数据为空",  
	      	      "sLoadingRecords": "载入中...",  
	      	      "sInfoThousands": ",",  
	      	      "oPaginate": {  
	      	          "sFirst": "首页",  
	      	          "sPrevious": "上页",  
	      	          "sNext": "下页",  
	      	          "sLast": "末页"  
	      	      },  
	      	      "oAria": {  
	      	          "sSortAscending": ": 以升序排列此列",  
	      	          "sSortDescending": ": 以降序排列此列"  
	      	      }  
	      	  }  ,
	           "iDisplayLength":15,
	       	  "lengthMenu":[10,15,20], 
	     	  "columns": [ 
						 { "data": "secondName",
						   "width":"20%",	
						   "orderable": false, // 禁用排序
			               "defaultContent": "",
						 },
			             { "data": "firstName",
							"width":"20%",
							"orderable": false, // 禁用排序
				            "defaultContent": "",
						 },
			             { "data": "secondName",
						   "orderable": false, // 禁用排序
				           "defaultContent": "",
						 },
			             {
			                  "data": "mtId",
			                  "orderable": false, // 禁用排序
			                  "defaultContent": "",
			                  "render": function (data, type, row, meta) {
			                	  return data = row.serial+'.'+row.testName;
			                  		}	             
					   		 },//"serial+'.'+testName"
			             { "data": "building_name",
					   	   "orderable": false, // 禁用排序
						   "defaultContent": "",
						 },
			             { "data": "development",
					   	   "orderable": false, // 禁用排序
						   "defaultContent": "",
					     },
			             { "data": "executor",
					   	   "orderable": false, // 禁用排序
						   "defaultContent": "",
					     },
			             { "data": "state_finished",
					   	   "orderable": false, // 禁用排序
						   "defaultContent": "",
						  },
	                  	 {
		                  "data": "execute_time",
		                  "orderable": false, // 禁用排序
		                  "defaultContent": "",
		                  "render": function (data, type, row, meta) {
		                	  	if(data !== ''){
									 return moment(data).format("YYYY/MM/DD");
								 }else{
									 return data = '<input type="date" value="'+data+'" name="TypeDate/'+row.secondName+'/'+row.mtId+'"/>';
								 }
		                	  
		                  	}	             
				   		 }],
				   		"order": [[0,'asc']],  //默认按1列（类型）数据降序排序　
				   		"columnDefs": [
				   	                { "visible": false, "targets": 0 } //隐藏计划所属类别列
				   	            ], 
				   	 	"drawCallback": function ( settings ) {
				   	 		var removeBefore = $(".removeForRefresh");
				   	 		if(removeBefore){
				   	 		removeBefore.remove();
				   	 		}
			              var api = this.api();
			              var rows = api.rows( {page:'current'} ).nodes();
			              var last=null;
			              //添加分组头
			              api.rows( {page:'current'} ).data().each( function ( item, i ) {
			            	
			            	 
			            	  if(item.development==='已下发')
	                          {
			            		  if ( last !== item.secondName ) {
				                      $(rows).eq( i ).before(
				                    	
				                    	'<input class="removeForRefresh" type="checkbox"  name="typeName" style="visibility:hidden"/>'+
				                    	  '<span class="removeForRefresh">'+item.secondName+'</span>'
				                         
				                      );
				                      last = item.secondName;
				                  }
	                               
	                          }
			            	  else{
			            		  if ( last !== item.secondName ) {
				                      $(rows).eq( i ).before(
				                    	
				                    	  '<input class="removeForRefresh" type="checkbox" name="typeName" value="' + item.secondName + '"  />'+
				                    	  '<span class="removeForRefresh">'+item.secondName+'</span>'
				                         
				                      );
				                      last = item.secondName;
				                  }
			            	  }
			                 
			              } );
			            },
			     
	      } );	      
	    
	    
	}
	 
	//下发计划，点击提交按钮
	function pushPlan(){
		//获取所有被选中的复选框的值
	    let typeChecked = [];
	    $("input:checkbox[name='typeName']:checked").each(function(k){
	    	typeChecked.push($(this).val());
	    });//返回的是一个数组，因为可能选了不止一个复选框
	    let arr = [];
	    //params为向后台传的数组d
	    let params = [];
	    for(item in typeChecked){
	    	//根据选择的复选框，选择到匹配成功的name值的数组$("input:date[name^="+item+"]"),复选框的name值为：类别/id拼接的
	    	var typeName = typeChecked[item];
	    	var getDateInput =$("input[name^='TypeDate/"+typeName+"']");
	    	
	    	for(index in getDateInput){
		    	//console.log(arr[item]);
		    	if(getDateInput[index].name && getDateInput[index].name.indexOf("TypeDate/") === 0){
		    		params.push({"id":getDateInput[index].name.split('/')[2],"date":getDateInput[index].value});
		    	}
		    	
		    }
	    	
	    }
	    
	    //获取选中人员
	    var person = $("#enterprise_id").val();
	    var buildingId = $("#buildingList").val();
	    var planId = ${planId};
	    var contractId=${contractId};
	 	$.ajax({
	  		 url: "/firefighting/MaintenancePlan/developmentPlan.htm",
	           type: "POST",
	           dataType: "json",
	           data: {
	          	 "params":JSON.stringify(params),
	          	 "buildingId":buildingId,
	          	 "personId":person,
	          	 "id":planId,
	           },
	           traditional: true,//属性在这里设置
	           cache: false,
	           success: function (data)
	           {
	          	  var flag = data.flag;
	                if(flag == 1)
	                {
	                    alert("下发成功！");
	                }
	                else if(flag == 2)
	                {
	                    alert("请选择时间");
	                }else{
	                	alert("下发失败");
	                }
	                window.location.href= "/firefighting/MaintenancePlan/getMaintenanceList.htm?id="+planId+"&contractid="+contractId;
	         	 
	           },
	           error:function(data)
	           {
	         	  alert("下发失败，请稍后再试！");
	           }
	       });
	    
	}
    

    
   
    
	</script>

</body>
</html>